<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>操作系统模拟进程调度</title>
    <link rel="stylesheet" href="css/bootstrap.min.css"/>
    <script src="js/modernizr.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="css/normalize.css" />
    <link rel="stylesheet" type="text/css" href="css/styles.css">
    <link rel="stylesheet" href="css/index.css"/>
</head>
<body>
<div class="container-fluid">
    <div class="header">
        <input type="text" class="form-control header-input" id="numberOfProcess"/>
        <button class="btn btn-success" onclick="createProcess()">创建进程</button>
        <button class="btn btn-success" onclick="destroyProcess()">重置</button>
        <label><input name="pro" type="radio" value="0" class="radio-header" checked/>时间片轮转</label>
        <label><input name="pro" type="radio" value="1" class="radio-header"/>优先级</label>
        <label><input name="pro" type="radio" value="2" class="radio-header"/>最短进程优先</label>
        <label><input name="pro" type="radio" value="3" class="radio-header"/>最短剩余时间优先</label>
        <button class="btn btn-success" onclick="runPro()">运行</button>
        <p style="color: #449d44">还可创建进程个数：</p>
        <p style="color: red;" id="lastNumber">50</p>
        <p id="runTime" style="color: #449d44">运行时间</p>
    </div>
    <table class="table table-hover table-bordered table-striped" id="process-table">
        <thead>
        <tr>
            <th style="width: 100px;">进程标识符</th>
            <th style="width: 100px;">进程状态</th>
            <th style="width: 100px;">优先级</th>
            <th style="width: 100px;">总时间</th>
            <th style="width: 100px;">剩余时间</th>
            <th style="width: 100px;">进度</th>
        </tr>
        </thead>
        <tbody>
        <tr>

        </tr>
        </tbody>
    </table>
</div>
<table id="template-list" style="display:none;">
    <tbody id="template-list-tbody">
    <tr id="template-list-tr">
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td>
            <div class="progress progress--active">
                <b class="progress__bar">
                    <span class="progress__text">
                        Progress: <em>0%</em>
                    </span>
                </b>
            </div>
        </td>
    </tr>
    </tbody>
</table>
<script src="js/jquery-2.1.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src='js/stopExecutionOnTimeout.js?t=1'></script>
<script src="js/main.js"></script>
</body>
</html>